<template>
  <view class="conditionSerch">
    <view>全部（{{total}}条）</view>
    <view :class="deType == 0 ? 'conditionColor' : ''" 
    @click="isDeType(0)">默认排序</view>
    <view :class="deType == 1 ? 'conditionColor condiDow' : 'condiDow'"
    @click="isDeType(1)" 
    >
      <view>发布时间</view>
      <view class="iconfont icon-xiangxia1"></view>
    </view>
    <view :class="deType == 2 ? 'conditionColor condiDow' : 'condiDow'" 
    @click="isDeType(2)">
      <view>订阅数</view>
      <view class="iconfont icon-xiangxia1"></view>
    </view>
  </view>
  <!-- 展示列表 -->
  <view class="serchItem" v-for="item,index in dataList" :key="index" @click="cerchDataPatent(item.ID)">
    <image class="serchItemImg" :src="item.img" mode="scaleToFill" />
    <view>
      <view class="patentTitle">{{ item.name }}</view>
      <view class="patentClassify">{{ item.orderNum }}条，订阅{{ item.audit_status }}次</view>
    </view>
  </view>
</template>
<script setup>
import { inject, defineProps,reactive, toRefs, } from "vue";
import { onLoad } from "@dcloudio/uni-app";
const { dataList, deType, isOrder, total } = defineProps({
  dataList: {
    type: Array,
    default: [],
  },
  deType: {
    type: Number || String,
    default: "",
  },
  isOrder: {
    type: Function
  },
  total: {
    type: Number || String,
  }
});
const isDeType = (index) => {
  isOrder(index)
}
const cerchDataPatent = (id) => {
  uni.navigateTo({
    url: `/pages/creamDetails/index?id=${id}`,
  });
};
</script>

<style scoped>
/* 条件筛选 */
.conditionSerch {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  margin-top: 12rpx;
  font-size: 22rpx;
  font-weight: 400;
  color: #333333;
}
.conditionSerch view {
  margin-right: 18rpx;
}
.conditionColor {
  color: #1677ff !important;
}
.condiDow {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
.condiDow view {
  margin-right: 8rpx;
}
.condiDow .iconfont {
  font-size: 24rpx;
}
/* 展示列表 */
.serchItem {
  display: flex;
  align-items: center;
  margin-top: 32rpx;
}
.serchItemImg {
  margin-right: 16rpx;
  width: 109rpx;
  height: 109rpx;
  background: #d8d8d8;
  border-radius: 11rpx;
}
.patentTitle {
  margin-top: 7rpx;
  width: 461rpx;
  height: 40rpx;
  font-size: 29rpx;
  font-weight: 400;
  color: #333333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.patentClassify {
  margin-top: 9rpx;
  font-size: 25rpx;
  font-weight: 400;
  color: #888888;
}
</style>
